<template>
  <Header />
  <div class="main box_center cf">
    <div class="channelWrap channelBanner cf">
      <el-breadcrumb separator=">">
        <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
        <el-breadcrumb-item>传统足球试玩</el-breadcrumb-item>
      </el-breadcrumb>
      <el-tabs type="border-card">
        <el-tab-pane label="14场/任九场"> <Spf14Game /></el-tab-pane>
        <el-tab-pane label="6场半全场"><Hhad6Game/></el-tab-pane>
        <el-tab-pane label="4场总进球"><Ttg4Game/></el-tab-pane>
      </el-tabs>
    </div>
  </div>
  <FriendLink />

  <Footer />
</template>

<script>
import { reactive, toRefs, onMounted } from "vue";
import Header from "@/components/common/Header";
import Footer from "@/components/common/Footer";
import Spf14Game from "@/components/sfc/Spf14Game";
import Ttg4Game from "@/components/sfc/Ttg4Game";
import Hhad6Game from "@/components/sfc/Hhad6Game";
export default {
  name: "home",
  components: {
    Header,
    Spf14Game,
    Ttg4Game,
    Hhad6Game,
    Footer,
  },
  setup() {
    const state = reactive({
      // 轮播图
      sliderContent: [],
      // 顶部栏
      topBooks1: [],
      //本周强推
      weekcommend: [],
      // 热门推荐
      hotRecommend: [],
      // 精品推荐
      goodRecommend: [],
      imgBaseUrl: process.env.VUE_APP_BASE_IMG_URL,
    });

    onMounted(async () => {

    });

    return {
      ...toRefs(state),
    };
  }
};
</script>
